<template>
	<view class="content">
		<view class="sticky-box">
			<search-input ref="searchInput" placeholder="请输入关键字查询" @searchConfirm="handleSearch($event)"></search-input>
			<!-- <view class="flex-col search-view">
				<view class="flex-row search-box">
					<image class="scan-img" src="../../static/img/scan.png" mode="scaleToFill"></image>
					<input class="search-input" type="text" 
						placeholder-class="input-placeholder" placeholder="请输入关键字查询"
						v-model="searchCode" :focus="isFocus" @confirm="confirmScan" 
						ref="sipt" @blur="searchBlur"
						confirm-type="done"
						@focus="searchFocus" @input="searchInput">
				</view>
			</view> -->
		</view>
		<view class="list-panel">
			<view class="list-item" @tap="toGoodsList(item)" v-for="(item, index) in companyList" :key="index">
				<text>{{item.SupplierName}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import searchInput from '@/components/search-input/search-input.vue'
	var that;
	export default {
		props: {
			toUrl: {
				type: String,
				default () {
					return '#FFFFFF'
				}
			},
			submitUrl:{
				type:String,
				default(){
					return 'supplierstock/supplierlist'
				}
			}
		},
		components: {
			searchInput
		},
		data() {
			return {
				isFocus: false,
				searchVal: '',
				companyList: new Array(3).fill({
					Name: '100 江西南华医药有限公司'
				})
			}
		},
		computed: {
			...mapState({
				userInfo: state => state.userInfo, // userInfo
				Token: state => state.Token, // Token
			})
		},
		created() {
			that = this;
			that.getServerData()
		},
		
		methods: {
			getServerData() {
				const Filter = `${that.searchVal}`;
				let requestData = {}
				uni.showLoading({
					title: '加载中'
				});
				//console.log(that.submitUrl)
				that.$request.globalRequest(that.submitUrl, 'POST', requestData, '', 0).then(res => {
					uni.hideLoading();
					//console.log(res)
					let data = res;
					if (data.length !== 0) {
						that.companyList = data;
					} else {
						that.companyList = []
					}
				}).catch(res => {
					uni.hideLoading();
					that.$common.showNormalToast(res);
					console.log(res);
				})
			},
			confirmScan(e) {
				that.searchVal = e.detail.value;
			},
			searchInput(e) {

			},
			searchBlur(e) {

			},
			searchFocus(e) {

			},
			handleSearch(res) {
				that.searchVal = res.value
			},
			toGoodsList(item) {
				let url = {}
				
				if (that.toUrl!="pagesContrast")
				{
					url = {
						path: '/' + that.toUrl + '/goodsList/goodsList', //pagesStockIn
						query: item
					}
				}
				else
				{
					url = {
						path: '/pagesContrast/goodsContrast/goodsContrast', 
						query: { 
							SupplierCode: item.SupplierCode,
							SupervisionCode: that.searchVal,
							scanType:1
						}
					}
				}
				
				that.$Router.push(url)
			},
			handleCleanSearch() {
				this.$refs.searchInput.cleanInput()
			}
		}
	}
</script>

<style>
	@import "@/styles/page.scss";

	.search-view {
		@include search-view;
	}


	.list-item {
		margin: 32rpx;
		padding: 32rpx;
		border-radius: 16rpx;
		font-size: 40rpx;
		font-weight: 600;	
		background-color: #FFFFFF;
	}
</style>
